<template>
    <div>
         
<div class="ud-app-loader ud-component--header-v6--header udlite-header" data-module-id="common/udlite/desktop" data-module-args="{&quot;isInstructorSignupEnabled&quot;:false,&quot;isLoggedIn&quot;:false,&quot;tryUFBPlacements&quot;:{&quot;bar&quot;:&quot;ufb_header&quot;,&quot;profile&quot;:&quot;account-menu&quot;,&quot;mobile&quot;:&quot;ufb_header&quot;},&quot;mobileAppLink&quot;:{&quot;url&quot;:&quot;/mobile/&quot;},&quot;searchPhrase&quot;:null}" data-module-priority="-10"><div data-unique-id="339" style="display:none"></div>

<div class="udlite-text-sm header--header--3sK1h header--flex-middle--2Xqjv" data-purpose="header"><div class="skip-to-content-button--skip-to-content--1MoIi"><button type="button" class="udlite-btn udlite-btn-large udlite-btn-primary udlite-heading-md skip-to-content-button--skip-to-content-btn--3Uakj"><span aria-hidden="true" class="skip-to-content-button--skip-to-content-shadow--eBW6V"></span><span style="margin:0">跳转至目录</span></button></div><a href="/" class="header--flex-middle--2Xqjv header--logo--bdAod"><img src="../assets/static/picture/logo-coral.svg" alt="Udemy" width="110" height="32" /></a>
<nav class="header--gap-button--3bIww popper--popper--19faV popper--popper-hover--4YJ5J">
    <span class="udlite-text-sm header--dropdown-button-text--2jtIM">
        <!-- 类别 --> 
    </span>
</nav>


<div class="udlite-search-form-autocomplete header--search-bar--1_mS0 udlite-form-group"><label class="udlite-sr-only udlite-form-label udlite-heading-sm" for="u339-search-form-autocomplete--3">搜索任何内容</label>

    <input placeholder="搜索任何内容" name="q" autoComplete="off" value="" id="u339-search-form-autocomplete--3" class="udlite-text-input udlite-text-input-small udlite-text-sm udlite-search-form-autocomplete-input js-header-search-field" />
         </div>
        <div v-if="username">
            <el-link disabled>欢迎您：</el-link> 
            <van-tag round type="primary">{{username}}</van-tag>
            <router-link to="/my_back">个人中心</router-link>
    
            <!-- <a-sub-menu class="right" @click="handelclickLink">
                <span slot="title" class="submenu-title-wrapper">
                    <a-icon tyoe="setting"/>个人中心</span>
                <a-menu-item-group>
                <a-menu-item key = "accountCenter">账号信息</a-menu-item>
                <a-menu-item key = "accountSet">修改账号信息</a-menu-item>
                <a-menu-item key = "accountPassword">修改账号密码</a-menu-item>
                </a-menu-item-group>
            </a-sub-menu> -->

            <a-button type="primary" @click="showModal">
            注销
        </a-button>
        <a-modal
                title="注销"
                :visible="visible"
                :confirm-loading="confirmLoading"
                @ok="handleOk"
                @cancel="handleCancel"
        >
            <p>{{ ModalText }}</p>
        </a-modal>
            <!-- <a-button type="primary"  @click="quit">注 销</a-button> -->
            <!-- <van-button type="primary" size="mini" @click="quit">注销</van-button> -->
        </div>

        <div v-else>
                 <router-link to="/ant_reg">注册</router-link>
                 <router-link to="/ant_login">登录</router-link>
            </div> 
    <div style="flex:1"></div></div></div>
    </div>
</template>

<script>    
import axios from 'axios'
// import mycate from '@/components/My_Cate'
export default {
  data(){
        return{
            username: localStorage.username,
            uid: localStorage.uid,
            email: localStorage.email,
            phone: localStorage.phone,
            ModalText: '你确定注销账号吗？, 是否继续?', 
            visible: false,
            confirmLoading: false,
            defaultProps: {
                province:{},
            },
        }
    },
    mounted:function(){
        // this.get_cate()
    },
    methods: {
        handelclickLink(){

        },
        //显示模态框
        showModal() {
            this.visible = true;
        },
        //点击ok
        handleOk(e) {
            this.ModalText = '已注销账号';
            // this.$message.info('注销账号已成功,请重新登录账号');
            this.confirmLoading = true;
            if(this.username){
                    window.localStorage.clear()
                    console.log('注销账号已成功');																																
                    this.$router.go(0)
                }
            setTimeout(() => {
                this.visible = false;
                this.confirmLoading = false;
            },2000)
            
        },
        //点击cancel
        handleCancel(e) {
            // this.ModalText = '注销账号失败';
            this.confirmLoading = true;
            this.$message.info('注销账号失败');
            console.log('注销账号失败');
            this.visible = false;
        }, 
    },    
    created() {

    }
}
</script>

<style>
van-button{
    position: absolute;
    bottom: 50%;
    right: 0;
    transform: translate(50%, 50%);
}


</style>